<extend name="Public/base"/>

<block name="body">
	<link href="__STATIC__/bootstrap/css/bootstrap.css" rel="stylesheet">
	<link href="__STATIC__/bootstrap-fileinput/css/fileinput.min.css" rel="stylesheet">
	<link href="__STATIC__/tag-input/jquery.tagsinput.css" rel="stylesheet">
	<script src="__STATIC__/bootstrap-fileinput/js/plugins/piexif.min.js" type="text/javascript"></script>
    <script src="__STATIC__/bootstrap-fileinput/js/plugins/sortable.min.js" type="text/javascript"></script>
    <script src="__STATIC__/bootstrap-fileinput/js/plugins/purify.min.js" type="text/javascript"></script>
    <script src="__STATIC__/bootstrap-fileinput/js/fileinput.js" type="text/javascript"></script>
    <script src="__STATIC__/tag-input/jquery.tagsinput.js" type="text/javascript"></script>
    
    <div class="container-fluid">
    <div class="row">
    	<div class="col-sm-4">
        	<h4>{$meta_title}</h4>
        </div>
    </div>

    <form action="{:U()}" role="form" method="post" class="form-horizontal">
		<div class="form-group">
			<label class="control-label col-sm-1 ">描述</label>
			<div class="col-sm-3">
				<input type="text" class="form-control muted" name="name" value="" placeholder="金币销售方案描述">
			</div>
		</div>
	    <div class="form-group">
	    	<label class="control-label col-sm-1 ">购买金币</label>
	    	<div class="col-sm-3">
		          <input type="text" class="form-control muted" name="amount" value="">
	    	</div>
	    </div>
		<div class="form-group">
			<label class="control-label col-sm-1">赠送金币</label>
			<div class="col-sm-3">
				<input type="text" class="form-control muted" name="additional_coin" value="">
			</div>
		</div>
        <div class="form-group">
            <label class="control-label col-sm-1">原价</label>
            <div class="col-sm-3">
				<input type="text" class="form-control muted" name="original_price" value="" placeholder="单位：（元），保留两位小数">
            </div>
        </div>
		<div class="form-group">
			<label class="control-label col-sm-1">促销价</label>
			<div class="col-sm-3">
				<input type="text" class="form-control muted" name="discount_price" value="" placeholder="单位：（元），保留两位小数">
			</div>
		</div>
        <div class="form-group">
	        <div class="col-sm-offset-1 col-sm-4">
	            <button class="btn submit-btn ajax-post" id="submit" type="submit" target-form="form-horizontal">确 定</button>
	            <button class="btn btn-return" onclick="javascript:history.back(-1);return false;">返 回</button>
	        </div>
        </div>
 	</form>
</block>


<block name="script">
    <script type="text/javascript">
        //导航高亮
        highlight_subnav('{:U('UserMember/memberCharge')}');
        
        $(function(){
        	$(function(){
            	$('#tags').tagsInput();
            	
    			var $input = $("#images");
            	
            	var footerTemplate = '<div class="file-thumbnail-footer" style ="height:94px">\n' +
            	'   <div style="margin:5px 0">\n' +
            	'       <input class="kv-input kv-new form-control input-sm text-center {TAG_CSS_NEW}" value="{caption}" placeholder="Enter caption...">\n' +
            	'       <input class="kv-input kv-init form-control input-sm text-center {TAG_CSS_INIT}" value="{TAG_VALUE}" placeholder="Enter caption...">\n' +
            	'   </div>\n' +
            	'   {size} {progress} {actions}\n' +
            	'</div>';
            	
            	$input.fileinput({
         
                    uploadAsync:true,
                    uploadUrl:"{:U('Oss/upload')}",
                    maxFileCount: 5,
                    overwriteInitial:false,
                    showUpload:false,
                    showRemove:true,
                    //layoutTemplates: {footer: footerTemplate},
                    previewThumbTags: {
                        '{TAG_VALUE}': '',        // no value
                        '{TAG_CSS_NEW}': '',      // new thumbnail input
                        '{TAG_CSS_INIT}': 'hide'  // hide the initial input
                    },
                    uploadExtraData: function() {  // callback example
                        var out = {}, key, i = 0;
                    
                        $('.kv-input:visible').each(function() {
                            $el = $(this);
                            key = $el.hasClass('kv-new') ? 'new_' + i : 'init_' + i;
                            out[key] = $el.val();
                            console.log(key);
                            i++;
                        });
                        return out;
                    },
                    initialPreviewAsData: true, // identify if you are sending preview data only and not the raw markup
                    initialPreviewFileType: 'image', // image is the default and can be overridden in config below
                    
                }).on("filebatchselected", function(event, files) {
                    // trigger upload method immediately after files are selected
                    $input.fileinput("upload");
                }).on('fileuploaded', function(event, data, previewId, index) {
    	            if(data.response) {
                		$("#"+previewId).append('<input type="hidden" name="image_ids[]" image_id= "'+data.response.info.image_id+'" value="'+data.response.info.image_id+'" >');
                	}
    	        }).on("filebatchuploadsuccess", function(event, data, previewId, index) {
                	console.log("filebatchuploadsuccess");
                	
                }).on("filepredelete",  function(event, key, jqXHR, data) {
                    console.log('Key = ' + key);
                    //console.log(data);
                });
            })
        })
    </script>
</block>
